<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Voyager Backend - Group Management</title>
<script type="text/javascript" src="../lib/angular/angular.min.js"></script>
<script src="http://code.angularjs.org/1.2.1/angular-route.min.js"></script>
 
<link rel="stylesheet" type="text/css" href="../app/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css"
	href="../app/css/bootstrap-responsive.min.css">
<link rel="stylesheet" type="text/css" href="../app/css/main.css">
<link rel="stylesheet" type="text/css"
	href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
	 <style>
        #areaMap, #addressMap
        {
            height: 400px;
            width: 400px;
            margin: 10px;
            padding: 10px;
        }
		
		#map {
			height:420px;
			width:600px;
		}
		.infoWindowContent {
			font-size:  14px !important;
			border-top: 1px solid #ccc;
			padding-top: 10px;
		}
		h2 {
			margin-bottom:0;
			margin-top: 0;
		}
    </style>
</head>
<body ng-app="myApp">


		<div class="container">
			<div class="main row">
				<div class="col-xs-3" ng-controller="homeCtrl">
					<ul class="list-group">
						<li class="list-group-item"><a href="#/home"> <span
								class="glyphicon glyphicon-home"></span></a></li>

						<li ng-repeat="item in menu" class="list-group-item"><a
							href="{{item.href}}"> {{item.link}}</a></li>
                        <li class="list-group-item"><a href="#" ng-click="logout()"> <span
								class="glyphicon glyphicon-log-out"></span></a></li>

					</ul>
				</div>
				<div class="col-xs-9 panel panel-default" ng-controller="mapCtrl"
					data-ng-init="init()">

						


					<div>
						<caption>
							<h1>Map</h1>
							<div class="col-sm-2" style="padding-left:0px;">Latitude :</div>
							<div class="col-sm-10" style="padding-left:0px;"><input type="text" ng-model="latitude"
										 placeholder="latitude">
							</div>
							
							<div class="col-sm-2" style="padding-left:0px;">Longtitude:</div>
							<div class="col-sm-10" style="padding-left:0px;"><input type="text" ng-model="longtitude"
										 placeholder="longtitude">
							</div>
							
							<div class="col-sm-2" style="padding-left:0px;">Radius:</div>
							<div class="col-sm-10" style="padding-left:0px;">
							    <select ng-model="radius" ng-init="radius = filter_map[0]"
									ng-options="c.radius for c in filter_map">
										
								</select>
							</div>
							
						</caption>
						    <div class="form-group">
							<label class="col-sm-3 control-label"></label>
							<div class="col-sm-9">
								<p class="form-control-static">  <!--
									<a href="#/event" ng-click="return_to_event_detail(null,1)"> <span
										class="glyphicon glyphicon-arrow-left"></span></a>  -->
										
										<button type="button" class="btn btn-success" ng-click="search()"> Search</button>
								</p>
							</div>
						    </div>
						
							<div id="map"></div>  
							<p>Double click in the map to search the groups and events nearby</p>
					</div>
					
					
					    <div class="form-group">
							<label class="col-sm-2 control-label"  id="label">List of {{nb_events}} event(s) nearby</label>
							<div class="col-sm-10"
								style="padding-left: 0px; padding-top: 0px;">

								<ul class="list-group" style="margin-left: 13px;"">
                                 
									<li ng-repeat="item in d"
										class="list-group-item" style="width: 70%">
										 <a href="#/event_detail/{{item[1]}}">{{item[0]}}</a>
									</li>

								</ul>

							</div>
							
							<div>

								 <nav>
									<ul class="pager">
										<li ng-hide="disablePrev_eg"><a href="#/map"
											ng-click="previousPage_eg()">Previous</a></li>
										<li ng-hide="disableNext_eg"><a href="#/map"
											ng-click="nextPage_eg()">Next</a></li>
									</ul>
								</nav>

						    </div> 
						</div>
						
						
						<div class="form-group">
							<label class="col-sm-2 control-label"  id="label">List of {{nb_groups}} group(s) nearby</label>
							<div class="col-sm-10"
								style="padding-left: 0px; padding-top: 0px;">

								<ul class="list-group" style="margin-left: 13px;"">
                                 
									<li ng-repeat="item in b"
										class="list-group-item" style="width: 70%">
										 <a href="#/group_detail/{{item[1]}}">{{item[0]}}</a>
									</li>

								</ul>

							</div>
							
							<div>

								 <nav>
									<ul class="pager">
										<li ng-hide="disablePrev_group"><a href="#/map"
											ng-click="previousPage_group()">Previous</a></li>
										<li ng-hide="disableNext_group"><a href="#/map"
											ng-click="nextPage_group()">Next</a></li>
									</ul>
								</nav>

						    </div> 
						</div>
				</div>




			</div>
		</div>

</body>
</html>